@import "./sassConfig.scss";
@import "./normalize.scss";
@import "./ui.scss";
@import "./icon.scss";
@font-face {
    font-family: "bahnschrift";
    src: url("~@/assets/bahnschrift.ttf");
}


/* blank */

.blank-40 {
    height: 40px;
}

.blank-20 {
    height: 20px;
}

.blank-100 {
    height: 100px;
}


/* color */

.color-main {
    color: $color-main;
}

.color-white {
    color: white;
}

.color-success,
.color-OVER {
    color: #10da06;
}

.color-fail {
    color: #bd1b00;
}

.color-WAIT {
    color: $color-wait;
}

.color-CANCEL {
    color: #8c8c8c;
}


/* text-algin */

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}


/* line-height */

.lh-40 {
    line-height: 40px;
}


/* float */

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}


/* font-size */

.fs-24 {
    font-size: 24px;
}

.fs-12 {
    font-size: 12px;
}

.fs-18 {
    font-size: 18px;
}

.fa-b {
    font-family: "bahnschrift";
}


/* position */

.p-r {
    position: relative;
}

.p-a {
    position: absolute;
}


/* margin */

.mr-15 {
    margin-right: 15px;
}


/* clearfix */

.clearfix {
    @extend %clearfix;
}


/* opacity */

.opacity-4 {
    opacity: .4;
} // 0~1 

/* flex */

.flex-1 {
    flex: 1;
}


/* common ui */

.select-car-btn {
    display: block;
    width: 240px;
    height: 84px;
    margin: 0 17px;
    border-radius: 100px;
    line-height: 84px;
    text-align: center;
    color: #fff;
    font-size: 26px;
    font-weight: 300;
    background-color: $color-main;
}

.user-container {
    padding: 0 30px;
    overflow-y: auto;
    height: 100%;
}


/* user router-link */

.group-links {
    a {
        position: relative;
        display: block;
        margin: 0 -30px;
        padding: 0 30px;
        height: 64px;
        line-height: 64px;
        color: #484848;
        border-bottom: 1px solid rgba(255, 255, 255, .03);
        font-size: 16px;
        font-weight: 600;
    }
    .icon {
        width: 30px;
        height: 30px;
        margin: 0 16px -10px 0;
    }
    .arrow:after {
        content: "";
        position: absolute;
        right: 30px;
        top: 50%;
        width: 10px;
        height: 10px;
        margin-top: -7px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
        @include webkit(box-sizing,
        border-box);
        @include webkit(transform,
        rotate(45deg));
        opacity: .1;
    }
}

.button-block {
    width: 100%;
    display: block;
    text-align: center;
}